<template>
  <div>
    <a-card>
      <div class="head_box">
        <search @addHandle="addHandler" @searchHandler="searchHandler"></search>
      </div>
      <Table ref="STableRef" @formHandler="editHandler"></Table>
    </a-card>
    <Form ref="FormRef" v-model="formVisible" :modelTitle="modelTitle" @confirmHandle="confirmHandle"></Form>
  </div>
</template>

<script>
import search from './modules/search'
import Table from './modules/table'
import Form from './modules/form'

export default {
  name: 'form-index',
  components: {
    search,
    Table,
    Form
  },
  data() {
    return {
      formVisible: false,
      modelTitle: '添加'
    }
  },
  methods: {
    // 搜索
    searchHandler(params) {
      this.$refs['STableRef'].restList(true, params)
    },
    // 表单提交
    confirmHandle(e) {
      let status = false
      if (e) status = true
      this.$refs['STableRef'].restList(status)
    },
    // 编辑
    editHandler(e) {
      this.modelTitle = '编辑'
      this.$refs['FormRef'].initForm(e)
    },
    // 新增
    addHandler() {
      this.modelTitle = '添加'
      this.formVisible = true
    }
  }
}
</script>
<style scoped lang="less">
.head_btn_box {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.head_box {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  padding-bottom: 24px;

  .date_box {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    span {
      font-weight: bold;
    }
  }
  .date_box:nth-child(2) {
    margin-left: 24px;
  }
}
</style>
